<template>
    <div v-loading="pageLoading">
        <!-- 查询组件 -->
        <Search v-if="searchFields.length > 0" ref="search" :fields="searchFields" :search="getList">
        </Search>

        <!-- 表格组件 -->
        <DataTable v-loading="listLoading" :list="listData" :fields="listFields"
            :permissions="$store.state.permissions" :add="toSave"
            :edit="toSave" :del="del" :batchDel="batchDel" :exports="button">
            <slot slot="buttonSlot" slot-scope="scope">
                <el-tooltip content="字典明细配置" class="operatingButton" v-if="$store.state.permissions.insert && $store.state.permissions.update">
                    <el-link type="primary" icon="el-icon-s-tools" :underline="false" @click="openDetail(scope.row)">
                    </el-link>
                </el-tooltip>
            </slot>
        </DataTable>
        <!-- 分页 -->
        <el-pagination style="float:right;margin-top: 10px;" background layout="total, sizes, prev, pager, next"
            :page-sizes="[5, 10, 15, 30]" :page-size="pageSize" :total="total" @current-change="changePage"
            @size-change="changeSize">
        </el-pagination>

        <!-- 表单 -->
        <Form ref="form" :title="title" :visible.sync="formVisible" :fields.sync="formFields" :formData="formData" :submitForm="save">
        </Form>

        <!-- 数据字段定义 -->
        <el-dialog :title="'数据字典明细 -- ' + thisDictName" :visible.sync="detailVisible" width="80%"
            :before-close="cancelDetail" :close-on-click-modal="false">
            <DictDetail :dictCode="thisDictCode" :key="timer"></DictDetail>
            <br /><br />
        </el-dialog>


    </div>
</template>

<script>
const DictDetail = () => import("./detail.vue");

export default {
    components: {
        DictDetail
    },
    data() {
        return {
            // 页面加载
            pageLoading: false,
            // 对象编码
            objCode: "",

            // 查询项
            searchFields: [],
            // 列表展示项
            listFields: [],
            // 列表数据
            listData: [],
            // 列表loading
            listLoading: false,
            // 当前页码
            pageNum: 1,
            // 每页大小
            pageSize: 10,
            // 总条数
            total: 0,

            // 表单表头
            title: "",
            // 表单开关
            formVisible: false,
            // 表单字段
            formFields: [],
            // 表单数据
            formData: {},

            // 默认排序规则
            defaultSortRule: "",
            // 数据隔离开关
            enableDataIsolation: true,

            detailVisible: false,
            timer: "",
            thisDictName: "",
            thisDictCode: "",
        };
    },
    created() {
        // 接收路由参数
        this.objCode = "sys_dict";
        this.pageLoading = true;
        this.getListConfig("964224d8a77e11edb8f80242ac120002");
    },
    mounted() {
    },
    methods: {
        openDetail(row){
            this.thisDictName = row.dict_name;
            this.thisDictCode = row.dict_code;
            this.timer = new Date().getTime();
            this.detailVisible = true;
        },
        cancelDetail(){
            this.thisDictCode = "";
            this.detailVisible = false;
        },
        button() {
        },
        // 批量删除
        batchDel(uuids){
            let vo = {
                objectCode: this.objCode,
                uuids: uuids
            }
            this.$api.dict.del(vo).then(res => {
                if (res.code == 200) {
                    this.$message.success(res.msg);
                    this.refreshList();
                } else {
                    this.$message.error(res.msg);
                }
            })
        },
        // 删除
        del(uuid){
            let vo = {
                objectCode: this.objCode,
                uuid: uuid
            }
            console.log(vo);
            this.$api.dict.del(vo).then(res => {
                if (res.code == 200) {
                    this.$message.success(res.msg);
                    this.refreshList();
                } else {
                    this.$message.error(res.msg);
                }
            })
        },
        // 保存
        save(){
            let params = {
                uuid: this.formData['uuid'],
                dictName: this.formData['dict_name'],
                dictCode: this.formData['dict_code'],
            }
            this.$api.dict.save(params).then(res => {
                if (res.code == 200) {
                    this.$message.success("操作成功")
                    this.formVisible = false;
                    this.refreshList();
                } else {
                    this.$message.error(res.msg)
                    this.$refs.form.saveLoading = false;
                }
            })
        },
        // 打开新增|修改
        toSave(uuid){
            if(this.formFields.length == 0 ){
                this.$message.warning("此项暂不可用，请联系管理员！");
                return;
            }
            this.formData = {};
            if (uuid) {
                let vo = {
                    objectCode: this.objCode,
                    uuid: uuid
                }
                this.$api.baseData.detail(vo).then(res => {
                    if (res.code == 200) {
                        this.formData = res.data;
                        this.updateInit = true;
                    }
                })
                this.title = "修改"
            } else {
                this.title = "新增"
            }
            this.formVisible = true;
        },
        // 查询列表数据
        getList(param) {
            this.listLoading = true;
            let vo = {
                objectCode: this.objCode,
                page: {
                    page: true,
                    pageNum: this.pageNum,
                    pageSize: this.pageSize
                },
                conditions: [],
                sortType: this.defaultSortRule,
                enableDataIsolation: this.enableDataIsolation,
            };
            if (param) {
                this.searchFields.forEach(e => {
                    let fieldCode = e.value;
                    let operator = e.operator;
                    let value = param[e.value];
                    if (value !== undefined && value !== "") {
                        value = operator && operator == "like" ? "%" + value + "%" : value;
                        vo.conditions.push({ fieldCode: fieldCode, operator: operator, value: value });
                    }
                });
            }
            this.$api.baseData.list(vo).then(res => {
                if (res.code == 200) {
                    this.listData = res.data.list;
                    this.pageNum = res.data.pageNum;
                    this.total = res.data.total;
                }
                this.listLoading = false;
            });
        },
        // 获取页面基础列表配置
        getListConfig(uuid) {
            this.$api.baseListConfig.getConfigByUuid(uuid).then(res => {
                if (res.code == 200) {
                    this.defaultSortRule = res.data.sortRule;
                    this.searchFields = res.data.searchFields;
                    this.listFields = res.data.listFields;
                    this.formFields = res.data.formFields;
                    this.pageLoading = false;
                    this.enableDataIsolation = res.data.enableDataIsolation;
                    this.getList();
                }
                this.pageLoading = false;
            });
        },
        // 切换每页大小
        changeSize(pageSize) {
            this.pageSize = pageSize;
            this.refreshList();
        },
        // 切换页码
        changePage(pageNum) {
            this.pageNum = pageNum;
            this.refreshList();
        },
        refreshList(){
            if(this.$refs.search){
                this.$refs.search.search(this.$refs.search.param);
            }else{
                this.getList()
            }
        }
    },
}
</script>

<style>
</style>